آموزش گام به گام و تصویری HTML قسمت بیستم و یکم (ایران گستر)
نوشته شده توسط : فاطمه فیصلی

HTML

ایران گستر در صدد آن است تا با آموزش های تصویری خود, شما را با به روز ترین زبان های برنامه نویسی آشنا کند تا با یادگیری آنها بتوانبد وارد بازار کار شوید و کسب و کار خود را رونق بخشید. از این پس آموزش های HTML مارا دنبال کنید.

 

 

[caption id="attachment_3063" align="aligncenter" width="255"]HTML HTML[/caption]

 

 

آشنایی با XHTML

به زبان ساده، XHTML همان HTML است که به صورت XML نوشته شده باشد.(ایران گستر)

 XHTML مخفف EXtensible HyperText Markup Language و به معنی «زبان امتدادپذیر نشانه‌گذاری فرامتنی» است اما نگذارید این اسم های قلمبه و سلمبه شما را فریب دهد! XHTML دقیقا مانند HTML نوشته می شود اما قوانین سخت گیرانه تری دارد و همانطور که گفتیم انگار می خواهیم HTML را به صورت یک برنامه ی XML بنویسیم. همچنین قابل ذکر است که XHTML توسط تمام مرورگر های مطرح پشتیبانی می شود.(ایران گستر)

 

چرا XHTML ؟

بسیاری از صفحات وب دارای HTML بد و غیر معتبر هستند. به طور مثال کد HTML زیر در تمام مرورگر ها کار می کند اما از نظر فنی غیر صحیح است:(ایران گستر)

به نظر شما مشکل کد بالا چیست؟

کد بالا در وهله ی اول هیچ DOCTYPE ای ندارد و مشخص نکرده است که از چه ورژنی از HTML استفاده می کند. همچنین تگ <html> را در آخر سند بسته نشده است و هیچ تگ پایانی را مشاهده نمی کنیم. این اتفاق برای تگ های <head> و <h1> و <p> نیز اتفاق افتاده است.(ایران گستر)

این کد HTML کاملا غیر معتبر و غیر صحیح است اما در اکثر مرورگر های وب بدون مشکل به نمایش در می آید چرا که خود مرورگر ها متوجه اشکالات می شوند و آن ها را در هنگام نمایش تصحیح می کنند. اما این مسئله برای مرورگر های تلفن های همراه اتفاق نمی افتد. معمولا گوشی های هوشمند آنقدر پیشرفته نشده اند که هر نوع خطایی را متوجه شوند و تصحیحش کنند. بنابراین علاوه بر ضربه خوردن از جهت سئو، ممکن است کاربران تلفن های هوشمند نتوانند سایت شما را ببینند و کاربران زیادی را از دست بدهید.(ایران گستر)

از طرفی XML نوعی زبان نشانه گذاری است که در آن باید قوانین نشانه گذاری را به طور کامل رعایت کرد. همانطور که حدس می زنید ترکیب XML و HTML همان XHTML می باشد.(ایران گستر)

 

خصوصیات XHTML

برخی از مهم ترین خصوصیات زبان XHTML از این قرار اند:(ایران گستر)

  • تعریف DOCTYPE در این زبان اجباری است
  • تعریف attribute ای به نام xmlns در <html> اجباری است
  • وجود داشتن تگ های <html> و <head> و <title> و <body> در یک سند اجباری است
  • عناصر XHTML باید به صورت کاملا صحیح nest شوند (تو در تو قرار بگیرند)
  • تمام عناصر XHTML باید همیشه بسته شوند (تگ پایانی)
  • تمام عناصر XHTML باید با حروف کوچک نوشته شوند
  • اسناد XHTML باید حتما یک عنصر root (ریشه ای) داشته باشند
  • نام attribute ها باید همیشه با حروف کوچک نوشته شود
  • مقدار attribute ها باید در Quotation قرار بگیرد
  • خلاصه سازی attribute ها غیر مجاز است.

1- خلاصه سازی attribute ها یعنی مواردی مثل مورد زیر:(ایران گستر)

اگر به جای نوشتن <"option selected="selected> بنویسید <option selected> می گوییم attribute (در اینجا selected) را خلاصه کرده اید.

می خواهیم این موارد را به صورت خلاصه بررسی کنیم.(ایران گستر)

 

اعلام DOCTYPE

یک سند XHTML باید علاوه بر DOCTYPE شامل تگ های <html> و <head> و <title> و <body> باشد.

یک نمونه سند صحیح به این شکل است:(ایران گستر)

DOCTYPE ای که در بالا می بینید، نحوه ی اعلام DOCTYPE به عنوان XHTML است.

 

تو در تو بودن (nesting)

در زبان HTML بعضا می توانیم اشتباها عناصر را nest کنیم:(ایران گستر)

در این کد تگ های پایانی جا به جا بسته شده اند.

اما در XHTML باید کاملا صحیح nest شوند:

 

تگ های پایانی

در HTML این کد غلط است:(ایران گستر)

و این حالت صحیح است:(ایران گستر)

حتی تگ هایی که در HTML تگ پایانی ندارند باید در XHTML بسته شوند. در HTML این تگ ها به این صورت هستند:(ایران گستر)

اما در XHTML باید به این شکل نوشته شوند:

همچنین همیشه باید تگ هایتان با حروف کوچک باشند بنابراین کد زیر غلط است:(ایران گستر)

حالت صحیح این کد به این صورت است:(ایران گستر)

 

Attribute ها

کوچک بودن حروف برای attribute ها نیز صدق می کند، بنابراین کد زیر غلط است:(ایران گستر)

و شکل صحیح آن بدین صورت است:

همچنین باید مقدار این attribute ها در quotation باشد. کد زیر غلط است:(ایران گستر)

و شکل صحیح آن بدین صورت است:

خلاصه سازی attribute ها نیز غیر مجاز است. به نمونه های صحیح و غلط زیر نگاه کنید.(ایران گستر)

کد غلط:

حالت صحیح آن:(ایران گستر)

کد غلط:(ایران گستر)

حالت صحیح آن:(ایران گستر)

 

سوال: چطور می توانیم از HTML به XHTML مهاجرت کنیم؟(ایران گستر)

پاسخ: ابتدا باید یک DOCTYPE برای XHTML بنویسید و DOCTYPE قبلی را حذف کنید. سپس attribute ای به نام xmlns را به خودِ عنصر html اضافه کنید. سپس نام تمامی عناصر را با حروف کوچک بنویسید و این کار را با attribute ها نیز انجام دهید. در آخر تگ های خالی (تگ هایی که تگ پایانی ندارند) را ببندید و برای مقادیر attribute ها Quotation قرار دهید.(ایران گستر)

یک مثال از یک سند XHTML برای شما آورده ام:

مشاهده ی خروجی در JSBin

با نگاهی به این سند کوتاه متوجه می شوید که تمام موارد بالا در آن رعایت شده است.(ایران گستر)





:: بازدید از این مطلب : 21
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
تاریخ انتشار : جمعه 26 مهر 1398 | نظرات ()
مطالب مرتبط با این پست
لیست
می توانید دیدگاه خود را بنویسید


نام
آدرس ایمیل
وب سایت/بلاگ
:) :( ;) :D
;)) :X :? :P
:* =(( :O };-
:B /:) =DD :S
-) :-(( :-| :-))
نظر خصوصی

 کد را وارد نمایید:

آپلود عکس دلخواه: